<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<style type="text/css">
body {
  font-family: Helvetica, arial, sans-serif;
  font-size: 14px;
  line-height: 1.6;
  padding-top: 10px;
  padding-bottom: 10px;
  background-color: white;
  padding: 30px; }

body > *:first-child {
  margin-top: 0 !important; }
body > *:last-child {
  margin-bottom: 0 !important; }

a {
  color: #4183C4; }
a.absent {
  color: #cc0000; }
a.anchor {
  display: block;
  padding-left: 30px;
  margin-left: -30px;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0; }

h1, h2, h3, h4, h5, h6 {
  margin: 20px 0 10px;
  padding: 0;
  font-weight: bold;
  -webkit-font-smoothing: antialiased;
  cursor: text;
  position: relative; }

h1:hover a.anchor, h2:hover a.anchor, h3:hover a.anchor, h4:hover a.anchor, h5:hover a.anchor, h6:hover a.anchor {
  background: url() no-repeat 10px center;
  text-decoration: none; }

h1 tt, h1 code {
  font-size: inherit; }

h2 tt, h2 code {
  font-size: inherit; }

h3 tt, h3 code {
  font-size: inherit; }

h4 tt, h4 code {
  font-size: inherit; }

h5 tt, h5 code {
  font-size: inherit; }

h6 tt, h6 code {
  font-size: inherit; }

h1 {
  font-size: 28px;
  color: black; }

h2 {
  font-size: 24px;
  border-bottom: 1px solid #cccccc;
  color: black; }

h3 {
  font-size: 18px; }

h4 {
  font-size: 16px; }

h5 {
  font-size: 14px; }

h6 {
  color: #777777;
  font-size: 14px; }

p, blockquote, ul, ol, dl, li, table, pre {
  margin: 15px 0; }

hr {
  background: transparent url() repeat-x 0 0;
  border: 0 none;
  color: #cccccc;
  height: 4px;
  padding: 0;
}

body > h2:first-child {
  margin-top: 0;
  padding-top: 0; }
body > h1:first-child {
  margin-top: 0;
  padding-top: 0; }
  body > h1:first-child + h2 {
    margin-top: 0;
    padding-top: 0; }
body > h3:first-child, body > h4:first-child, body > h5:first-child, body > h6:first-child {
  margin-top: 0;
  padding-top: 0; }

a:first-child h1, a:first-child h2, a:first-child h3, a:first-child h4, a:first-child h5, a:first-child h6 {
  margin-top: 0;
  padding-top: 0; }

h1 p, h2 p, h3 p, h4 p, h5 p, h6 p {
  margin-top: 0; }

li p.first {
  display: inline-block; }
li {
  margin: 0; }
ul, ol {
  padding-left: 30px; }

ul :first-child, ol :first-child {
  margin-top: 0; }

dl {
  padding: 0; }
  dl dt {
    font-size: 14px;
    font-weight: bold;
    font-style: italic;
    padding: 0;
    margin: 15px 0 5px; }
    dl dt:first-child {
      padding: 0; }
    dl dt > :first-child {
      margin-top: 0; }
    dl dt > :last-child {
      margin-bottom: 0; }
  dl dd {
    margin: 0 0 15px;
    padding: 0 15px; }
    dl dd > :first-child {
      margin-top: 0; }
    dl dd > :last-child {
      margin-bottom: 0; }

blockquote {
  border-left: 4px solid #dddddd;
  padding: 0 15px;
  color: #777777; }
  blockquote > :first-child {
    margin-top: 0; }
  blockquote > :last-child {
    margin-bottom: 0; }

table {
  padding: 0;border-collapse: collapse; }
  table tr {
    border-top: 1px solid #cccccc;
    background-color: white;
    margin: 0;
    padding: 0; }
    table tr:nth-child(2n) {
      background-color: #f8f8f8; }
    table tr th {
      font-weight: bold;
      border: 1px solid #cccccc;
      text-align: left;
      margin: 0;
      padding: 6px 13px; }
    table tr td {
      border: 1px solid #cccccc;
      text-align: left;
      margin: 0;
      padding: 6px 13px; }
    table tr th :first-child, table tr td :first-child {
      margin-top: 0; }
    table tr th :last-child, table tr td :last-child {
      margin-bottom: 0; }

img {
  max-width: 100%; }

span.frame {
  display: block;
  overflow: hidden; }
  span.frame > span {
    border: 1px solid #dddddd;
    display: block;
    float: left;
    overflow: hidden;
    margin: 13px 0 0;
    padding: 7px;
    width: auto; }
  span.frame span img {
    display: block;
    float: left; }
  span.frame span span {
    clear: both;
    color: #333333;
    display: block;
    padding: 5px 0 0; }
span.align-center {
  display: block;
  overflow: hidden;
  clear: both; }
  span.align-center > span {
    display: block;
    overflow: hidden;
    margin: 13px auto 0;
    text-align: center; }
  span.align-center span img {
    margin: 0 auto;
    text-align: center; }
span.align-right {
  display: block;
  overflow: hidden;
  clear: both; }
  span.align-right > span {
    display: block;
    overflow: hidden;
    margin: 13px 0 0;
    text-align: right; }
  span.align-right span img {
    margin: 0;
    text-align: right; }
span.float-left {
  display: block;
  margin-right: 13px;
  overflow: hidden;
  float: left; }
  span.float-left span {
    margin: 13px 0 0; }
span.float-right {
  display: block;
  margin-left: 13px;
  overflow: hidden;
  float: right; }
  span.float-right > span {
    display: block;
    overflow: hidden;
    margin: 13px auto 0;
    text-align: right; }

code, tt {
  margin: 0 2px;
  padding: 0 5px;
  white-space: nowrap;
  border: 1px solid #eaeaea;
  background-color: #f8f8f8;
  border-radius: 3px; }

pre code {
  margin: 0;
  padding: 0;
  white-space: pre;
  border: none;
  background: transparent; }

.highlight pre {
  background-color: #f8f8f8;
  border: 1px solid #cccccc;
  font-size: 13px;
  line-height: 19px;
  overflow: auto;
  padding: 6px 10px;
  border-radius: 3px; }

pre {
  background-color: #f8f8f8;
  border: 1px solid #cccccc;
  font-size: 13px;
  line-height: 19px;
  overflow: auto;
  padding: 6px 10px;
  border-radius: 3px; }
  pre code, pre tt {
    background-color: transparent;
    border: none; }

@media screen and (min-width: 914px) {
    body {
        width: 854px;
        margin:0 auto;
    }
}
@media print {
	pre,code {
		word-wrap: break-word;
	}	
	/*
	table, pre {
		page-break-inside: avoid;
	}
	*/
}
</style>
<title>API.md</title>
</head>
<body>
<h2>$.drag() / iDrag()</h2>

<p>调用<code>$.drag()</code> / <code>iDrag()</code> 将返回实例对象</p>

<h3>配置参数</h3>

<table>
<thead>
            <tr>
              <th>参数</th>
              <th>类型</th>
              <th>默认值</th>
              <th>说明</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>target</td>
              <td>string/object</td>
              <td>undefined</td>
              <td>拖拽前，鼠标按下的有效区。</td>
            </tr>
            <tr>
              <td>root</td>
              <td>string/object</td>
              <td>上面target的jQuery对象</td>
              <td>拖拽时，移动的对象。</td>
            </tr>
            <tr>
              <td>min</td>
              <td>object</td>
              <td>undefined</td>
              <td>默认情况下可以是无穷小。如min:{x:0, y:0},表示移动的最小坐标不能小于(0,0)。</td>
            </tr>
            <tr>
              <td>max</td>
              <td>object</td>
              <td>undefined</td>
              <td>默认情况下可以是无穷大。如min:{x:100, y:100},表示移动的最小坐标不能大于(100,100)。</td>
            </tr>
            <tr>
              <td>start</td>
              <td>function</td>
              <td>undefined</td>
              <td>鼠标按下时的回调函数，第一个参数是一个对象{x,y}，保存的值是现在鼠标到视图窗口的坐标值</td>
            </tr>
            <tr>
              <td>move</td>
              <td>function</td>
              <td>undefined</td>
              <td>拖拽过程的回调函数，第一个参数是一个对象{x,y}，保存当前root元素的位置坐标。</td>
            </tr>
            <tr>
              <td>end</td>
              <td>function</td>
              <td>undefined</td>
              <td>拖拽结束时的回调函数，第一个参数是一个对象{x,y}，保存当前root元素的位置坐标。</td>
            </tr>
            <tr>
              <td>fixed</td>
              <td>boolean</td>
              <td>false</td>
              <td>表示root的定位模式是不是position:fixed。内部已经封装IE6兼容实现方法。</td>
            </tr>
          </tbody>
        </table>
        

<h2>$.dialog() / iDialog()</h2>

<p>调用<code>$.dialog()</code> / <code>iDialog()</code> 将返回实例对象</p>

<h3>配置参数</h3>

<table>
          <thead>
            <tr>
              <th>参数</th>
              <th>类型</th>
              <th>默认值</th>
              <th>说明</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>id</td>
              <td>string</td>
              <td>时间戳+new Date()</td>
              <td>添加id可以防止生成多个同样对话框的结构，亦可通过$.dialog.get(id)方法获取该实例。</td>
            </tr>
            <tr>
              <td>title</td>
              <td>string</td>
              <td>消息</td>
              <td>对话框的标题</td>
            </tr>
            <tr>
              <td>content</td>
              <td>string/object</td>
              <td>对话宽的内容</td>
              <td>可以是普通的html字符串，或者是DOM节点对象。</td>
            </tr>
            <tr>
              <td>width</td>
              <td>int</td>
              <td>内容的宽度</td>
              <td>不设置宽度时将会根据内容宽度来设置宽度，亦可手动设置。</td>
            </tr>
            <tr>
              <td>height</td>
              <td>int</td>
              <td>内容的高度</td>
              <td>不设置高度时将会根据内容高度来设置宽度，亦可手动设置。</td>
            </tr>
           <tr>
              <td>left</td>
              <td>int</td>
              <td>让对话框在视图下居中的值</td>
              <td></td>
            </tr>
            <tr>
              <td>top</td>
              <td>int</td>
              <td>对话框在视图区域，黄金比例的值</td>
              <td></td>
            </tr>
            <tr>
              <td>padding</td>
              <td>string/int</td>
              <td>20</td>
              <td></td>
            </tr>
            <tr>
              <td>fixed</td>
              <td>boolean</td>
              <td>false</td>
              <td>表示root的定位模式是不是position:fixed。内部已经封装IE6兼容实现方法。</td>
            </tr>
            <tr>
              <td>lock</td>
              <td>boolean</td>
              <td>false</td>
              <td>是否显示遮罩</td>
            </tr>
            <tr>
              <td>opacity</td>
              <td>number</td>
              <td>0.3</td>
              <td>遮罩层的透明度</td>
            </tr>
            <tr>
              <td>background</td>
              <td>string</td>
              <td>'#000'</td>
              <td>遮罩层的颜色</td>
            </tr>
            <tr>
              <td>follow</td>
              <td>string/object</td>
              <td>false</td>
              <td>对话框展现时，是否跟随follow元素的位置</td>
            </tr>
            <tr>
              <td>drag</td>
              <td>boolean</td>
              <td>true</td>
              <td>对话框是否可以拖拽</td>
            </tr>
            <tr>
              <td>effect</td>
              <td>string</td>
              <td>'db-scale'</td>
              <td>对话框打开是的动画的样式类名类(css3动画)</td>
            </tr>
            <tr>
              <td>init</td>
              <td>function</td>
              <td>undefined</td>
              <td>对话框初始化时的回调函数</td>
            </tr>
            <tr>
              <td>show</td>
              <td>function</td>
              <td>function(){}</td>
              <td>对话框打开时的回调函数，当return false时，将阻止默认的打开函数</td>
            </tr>
            <tr>
              <td>close</td>
              <td>function</td>
              <td>function(){}</td>
              <td>对话框关闭时的回调函数，当return false时，将阻止默认的关闭函数</td>
            </tr>
          </tbody>
        </table>
        

<h2>外部方法</h2>

<table>
          <thead>
            <tr>
              <th>函数</th>
              <th>参数</th>
              <th>说明</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>$.dialog.get()</td>
              <td>string</td>
              <td>传入在使用$.dialog()初始化时设置的id，将获得该实例的对象。</td>
            </tr>
          </tbody>
        </table>
        

<ul>
<li><p>在实例化<code>$.dialog()</code>时，得到的对象中包含着这许多属性成员和方法成员，这就给了使用者更加灵活的调用，例如动态改变对话框的标题、大小、位置、内容等。</p></li>
<li><p>除了表格《调用<code>$.dialog()</code> 将返回实例对象》上面罗列出来的成员，下面罗列出其它的成员： </p></li>
</ul>

<h3>属性/方法成员</h3>

<table>
          <thead>
            <tr>
              <th>成员</th>
              <th>类型</th>
              <th>说明</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>$lock</td>
              <td>jQuery object</td>
              <td>遮罩层节点的jQuery 对象</td>
            </tr>
            <tr>
              <td>$dialog</td>
              <td>jQuery object</td>
              <td>对话框最外层的元素</td>
            </tr>
            <tr>
              <td>$title</td>
              <td>jQuery object</td>
              <td>标题节点的jQuery 对象</td>
            </tr>
            <tr>
              <td>$content</td>
              <td>jQuery object</td>
              <td>内容节点的jQuery 对象</td>
            </tr>
            <tr>
              <td>$close</td>
              <td>jQuery object</td>
              <td>关闭按钮节点的jQuery 对象</td>
            </tr>
            <tr>
              <td>show</td>
              <td>function</td>
              <td>显示对话框</td>
            </tr>
            <tr>
              <td>hide</td>
              <td>function</td>
              <td>关闭对话框</td>
            </tr>
            <tr>
              <td>content</td>
              <td>function</td>
              <td>设置对话框的显示内容</td>
            </tr>
          </tbody>
        </table>
        

</body>
</html>